

<link rel="stylesheet" href="__CSS__/mall.css"/>
<script src="__STATIC__/js/jquery-2.1.1.min.js"></script>
<script src="__STATIC__/js/ace-extra.min.js"></script>
<script src="__STATIC__/js/laydate.js"></script>
<link rel="stylesheet" type="text/css" href="__STATIC__/webUploader/css/webuploader.css" />
<link rel="stylesheet" type="text/css" href="__STATIC__/webUploader/css/style.css" />

<style>
    .icon-close {
        position: relative;
        top: -8px;
        right: 18px;
        float:right;
        cursor: pointer;
    }
</style>

<div class="page-header mbx">
    <h1>
        <small>
            {$companyName}分公司管理 ｜采购申请详情 <i class="ace-icon fa fa-times xx"></i>
        </small>
    </h1>
</div>
<div class="mbx">
    <div class="widget-box transparent">
        <div class="nav-tab" style="position: relative">
            <ul class="nav-tab-title" style="margin-left: 0">
                <li class="nav-this">采购申请详情</li>
            </ul>
        </div>
        <div class="widget-body">
            <div class="widget-main padding-10">
                <div class="row">
                    <div class="col-xs-12">
                        <div class="s_form-border">
                            <form class="form-horizontal s_input-bgcolor s_overflow">

                                <div class="col-lg-4 col-md-6 col-sm-6 col-xs-12 pad-b20">
                                    <div class="form-group">
                                        <span class="s_detail-lword">申请类型：</span>
                                        {if condition='$info.applyType == 1'}
                                        新公司筹建
                                        {elseif condition='$info.applyType == 2'/}
                                        其他
                                        {/if}
                                    </div>
                                </div>

                                <div class="col-lg-4 col-md-6 col-sm-6 col-xs-12 pad-b20">
                                    <div class="form-group">
                                        <span class="s_detail-lword">申请时间：</span>
                                        <em style="color: #dc393f">{$info.applyTime}</em>
                                    </div>
                                </div>


                                <div class="col-lg-4 col-md-6 col-sm-6 col-xs-12 pad-b20">
                                    <div class="form-group">
                                        <span class="s_detail-lword">申请金额：</span>
                                        <em style="color: #dc393f">{$info.applyMoney}</em>
                                    </div>
                                </div>


                                <div class="col-lg-4 col-md-6 col-sm-6 col-xs-12 pad-b20">
                                    <div class="form-group">
                                        <span class="s_detail-lword">申请说明： </span>
                                        {$info.applyExplain}
                                    </div>
                                </div>

                                <div class="col-lg-4 col-md-6 col-sm-6 col-xs-12 pad-b20">
                                    <div class="form-group">
                                        <span class="s_detail-lword">申请人： </span>
                                        {$info.applyName}
                                    </div>
                                </div>

                                <div class="col-lg-4 col-md-6 col-sm-6 col-xs-12 pad-b20">
                                    <div class="form-group">
                                        <span class="s_detail-lword">收款账户： </span>
                                        {$info.collectionAccount}
                                    </div>
                                </div>

                                <div class="col-lg-4 col-md-6 col-sm-6 col-xs-12 pad-b20">
                                    <div class="form-group">
                                        <span class="s_detail-lword">收款方： </span>
                                        {$info.payee}
                                    </div>
                                </div>


                                <div class="col-lg-4 col-md-6 col-sm-6 col-xs-12 pad-b20">
                                    <div class="form-group">
                                        <span class="s_detail-lword">初审时间：</span>
                                        <em style="color: #dc393f">{$info.firstTime}</em>
                                    </div>
                                </div>

                                <div class="col-lg-4 col-md-6 col-sm-6 col-xs-12 pad-b20">
                                    <div class="form-group">
                                        <span class="s_detail-lword">初审人： </span>
                                        {$info.firstJudgeName}
                                    </div>
                                </div>

                                <div class="col-lg-4 col-md-6 col-sm-6 col-xs-12 pad-b20">
                                    <div class="form-group">
                                        <span class="s_detail-lword">初审结果： </span>
                                        {if condition='($info.firstApprove == 1)'/}
                                        <span class="text-success">初审通过</span>
                                        {elseif condition='($info.firstApprove == 2)'/}
                                        <span class="text-danger">初审未通过</span>
                                        {elseif condition='(empty($info.firstApprove))'/}
                                        <span class="text-muted">未审核</span>
                                        {/if}
                                    </div>
                                </div>


                                <div class="col-lg-4 col-md-6 col-sm-6 col-xs-12 pad-b20">
                                    <div class="form-group">
                                        <span class="s_detail-lword">终审时间： </span>
                                        <em style="color: #dc393f">{$info.finalTime}</em>
                                    </div>
                                </div>

                                <div class="col-lg-4 col-md-6 col-sm-6 col-xs-12 pad-b20">
                                    <div class="form-group">
                                        <span class="s_detail-lword">终审人： </span>
                                        {$info.finalJudgeName}
                                    </div>
                                </div>

                                <div class="col-lg-4 col-md-6 col-sm-6 col-xs-12 pad-b20">
                                    <div class="form-group">
                                        <span class="s_detail-lword">终审结果： </span>
                                        {if condition='($info.firstApprove == 1) AND ($info.finalApprove == 1)'}
                                        <span class="text-success">终审通过</span>
                                        {elseif condition='($info.firstApprove == 1) AND ($info.finalApprove == 2)'/}
                                        <span class="text-danger">终审未通过</span>
                                        {/if}
                                    </div>
                                </div>
                            </form>
                        </div>
                        <div class="s_form-textarea" style="margin-top: 10px;">
                            <span>发票上传</span>
                            {foreach name='invoiceList' item='v'}
                            <div style="display: inline-block" id="{$v.Id}"  money="{$v.money}" url="{$v.url}" class="jpimg">
                                <div class="cb-jpimg">
                                    <img src="{$v.url}"  class="showimg" style="width:200px;height: 160px; " />
                                    <img src="/static/images/admin/icon-close.png" id="{$v.Id}" class="icon-close">
                                    <div class="introduce">
                                        <p class="cb-num">发票金额：<span class="shopNum">{$v.money}</span></p>
                                    </div>
                                </div>
                            </div>
                            {/foreach}
                            <div style="display: inline-block" id="goodsDiv">
                                <div class="cb-jpimg" id="jpimgAdd">
                                    <img src="__STATIC__/images/admin/edit_add_iconx.png" alt="" style="width:200px;height: 160px; "/>
                                </div>
                            </div>
                        </div>

                        <div class="space"></div>

                        <div class="s_refund-btn" style="float:left;">
                            <button class="btn" type="button" onclick="addData({$resId})" style="width: 100px; border-radius: 2rem; background: #0451d7!important;border:1px solid #0451d7;margin-left: 60px;">确定</button>
                            <button class="btn " style="width: 100px; border-radius: 2rem; border:1px solid #999999;margin-left: 20px;color:#999 !important;background: #fff" onclick="javascript:window.history.back(-1);">返回</button>
                        </div>

                        <!-- /.row -->
                    </div>
                    <!-- /.col -->
                </div>
            </div>
        </div>
    </div>
</div>

<div class="dialog popup1 text-center" style="display: none">
    <div class="dia" style="width: 35%">
        <div class="dia-title ">
            <h3 class="font-size18" style="margin: 0">上传发票</h3>
            <button type="button" class="close close-btn">
                <i class="ace-icon fa fa-times" onclick="closePop()"></i>
            </button>
        </div>
        <div class="space"></div>
        <form action="" method="post" enctype="multipart/form-data">
            <input type="hidden" id='invoiceId'>
            <div class="layer-detail">
                <ul class="no-margin">
                    <li class="clearfix">

                        <span class="pull-left layer-detail-span font-size16">发票金额</span>
                        <div class="pull-left layer-detail-select" style="width: 73%;">
                            <input type="number" placeholder="请输入发票金额" required id="invoiceMoney">
                        </div>
                    </li>

                    <li class="clearfix  lecturer-file">
                        <span class="pull-left layer-detail-span font-size16">发票图片</span>
                        <div class="pull-left layer-detail-select add-list-select" id="upimg" style="padding:0px;width: 112px;height: 100px;">
                            <img src="__STATIC__/images/admin/edit_add_icon.png" width="80" >
                        </div>
                    </li>
                </ul>
            </div>
            <div class="dia-foot clearfix lecturer-foot">
                <div class="row">
                    <div class="col-sm-6">
                        <input class="btn bj-blue" type="text" value="确定" id="submitBtn" style="border-radius: 2rem !important;width: 90px;">
                    </div>
                    <div class="col-sm-6">
                        <input class="btn btn-outline" type="reset" onclick="closePop()" value="取消">
                    </div>
                </div>
            </div>
        </form>
    </div>
</div>
<script>
    const FILE_UPLOAD_URL = 'http://120.78.15.70:9001/uploadImg/index';
</script>
<script type="text/javascript" src="__STATIC__/webUploader/dist/webuploader.js"></script>
<script type="text/javascript" src="__STATIC__/webUploader/dist/mupload.js"></script>

<script type="text/javascript">
    var upImgUrl = '';
    function createUpload(upid) {
        uploader.addButton({
            id: '#'+upid,
            innerHTML: ''
        });
    }
    createUpload('upimg');
    laydate.render({
        elem: '#start' //指定元素
    });
    laydate.render({
        elem: '#end' //指定元素
    });
    var index=0;

    var goodsData=[];
    var _this = '';
    $(".jpimg").on("dblclick",function(){
        _this = $(this);
        var id = $(this).attr('id');
        var money = $(this).attr('money');
        var url = $(this).attr('url');
        $("#invoiceId").val(id);
        $("#invoiceMoney").val(money);
        $('#upimg').attr('style',"padding:0px; width: 112px;height: 100px;");
        $('#upimg').find('img').attr('src',url);
        $(".dropify-render").find('img').attr('src',url);
        $(".popup1").show();
        index=$(this).index();
        $(".goodsjp").remove();
        upImgUrl = '';
    })
    $("#jpimgAdd").on("click",function(){
        $("#invoiceId").val('');
        $("#invoiceMoney").val('');
        $(".goodsjp").remove();
        upImgUrl = '';
        $('#upimg').find('img').attr('src','__STATIC__/images/admin/edit_add_icon.png');
        $('#upimg').show();
        $(".popup1").show();
    });
    function closePop(){
        $(".popup1").hide();
    }

    $("#submitBtn").on("click",function(){
        var invoiceId =$("#invoiceId").val();
        if(invoiceId == ''){
            if(!upImgUrl){
                return;
            }
        }
        var invoiceMoney=$("#invoiceMoney").val();
        if(upImgUrl == ''){
            upImgUrl = _this.find('img').attr('src');
        }

        var addDiv='<div style="display: inline-block" id="'+invoiceId+'" money="'+invoiceMoney+'" url="'+upImgUrl+'" class="jpimg">';
        addDiv = addDiv + '<div class="cb-jpimg">';
        addDiv = addDiv + '<img src="'+upImgUrl+'" class="showimg" style="width:200px;height: 160px; ">';
        addDiv = addDiv + '<div class="introduce">';
        addDiv = addDiv + '<p class="cb-num">发票金额：<span class="shopNum">'+invoiceMoney+'</span></p></div></div></div>';

        if(invoiceMoney){
            if(invoiceId){
                _this.before(addDiv);
                _this.remove();
                closePop();
            }else{
                invoiceId = '';
                $("#goodsDiv").prepend(addDiv);
                closePop();
            }
            //插入数组数据
            var prizeInfo={Id:invoiceId,invoiceMoney:invoiceMoney,upImgUrl:upImgUrl};
            goodsData.push(prizeInfo);
            console.log(JSON.stringify(goodsData));
        }else{
            layer.msg('信息请填写完整!!!');
        }
    })

    $(".icon-close").on("click",function(){
        var dataid = $(this).attr('id')
        $(this).parent().parent().remove();
        var prizeInfo={Id:dataid,Type:'delete'};
        goodsData.push(prizeInfo);
    })

    function addData(Id) {
        var goodsDataJson = JSON.stringify(goodsData);
        if(goodsDataJson.length==2){
            layer.msg('上传发票不能为空');
        }else {
            $.post('/admin/purchase/insertapplypicinvoice',{id:Id,goodsDataJson:goodsDataJson},function(data) {
                layer.msg('编辑成功');
                location.href = '/admin/purchase/applyList';
            });
        }
    }
</script>